<!--
 * @Author: 260156 260156@gree.com.cn
 * @Date: 2022-08-10 14:43:02
 * @LastEditors: 260156 260156@gree.com.cn
 * @LastEditTime: 2022-08-18 10:50:55
 * @FilePath: \gree-zst-web\src\views\manage\organization\components\OrgHeader.vue
 * @Description: 
 * 
 * Copyright (c) 2022 by 260156 260156@gree.com.cn, All Rights Reserved. 
-->
<template>
  <div class="org-header">
    <el-button type="primary" @click="handleDownload"> 导出 </el-button>
    <el-button type="success" @click="handleAdd">新增</el-button>
  </div>
  <edit-add-form
    v-model="visible"
    flag="add"
    :formData="editFormData"
    @handleConfirm="handleConfirm"
  ></edit-add-form>
</template>
<script lang="ts" setup>
import { ElMessage } from "element-plus";
import EditAddForm from "./EditAddForm.vue";
import { addOrganization } from "api/manage/manage";
import type { EditForm } from "../types";

interface Emits {
  (e: "handleSearch"): void;
  (e: "handleDownload"): void;
}
const emit = defineEmits<Emits>();

const visible = ref<boolean>(false);
const editFormData = ref<EditForm>();

const handleAdd = () => {
  visible.value = true;
};

const handleConfirm = async (params: EditForm) => {
  // do add api
  await addOrganization({
    name: params.name,
    parentId: 1,
  });
  ElMessage({
    type: "success",
    message: "新增成功",
  });
  emit("handleSearch");
  visible.value = false;
};

const handleDownload = () => {
  emit("handleDownload");
};
</script>

<style lang="scss" scoped>
.org-header {
  padding: 0 10px;
  display: flex;
  justify-content: space-between;
}
</style>
